<template>
  <view v-if="shenheStatus == 0 && cardData.verify_card_info" class="message">
    <view class="item">
      <view class="title">{{ $t("coupon.validity") }}</view>
      <view class="data flex-y-center">
        <view></view>
        <view>
          <text v-if="cardData.verify_card_info.date_type == 2">
            {{ $t("coupon.validity") }}：{{
              cardData.verify_card_info.begin_time
            }}~{{ cardData.verify_card_info.end_time }}
          </text>
          <text
            v-else-if="
              cardData.verify_card_info.date_type == 1 &&
              cardData.verify_card_info.expire_day == 0
            "
          >
            {{ $t("user.long") }}
          </text>
          <text v-else>
            {{ $t("facePay.getted") }}{{ cardData.verify_card_info.expire_day
            }}{{ $t("coupon.date2") }}
          </text>
        </view>
      </view>
    </view>
    <view class="item">
      <view class="title">{{ $t("user.cardVal") }}</view>
      <view class="data flex-y-center">
        <view></view>
        <view>{{ cardData.verify_card_info.price }}</view>
      </view>
    </view>
    <!-- 折扣金额 -->
    <view class="item">
      <view class="title">折扣金额</view>
      <view class="data flex-y-center">
        <view></view>
        <view>{{ cardData.verify_card_info.for_cash }}</view>
      </view>
    </view>
    <!-- <template v-if="getForm.list.length">
      <view class="item" v-for="(item, index) of getForm.list" :key="index">
        <view class="title">{{ item.name }}</view>
        <view class="data flex-y-center">
          <view></view>
          <view>{{ item.default }}</view>
        </view>
      </view>
    </template> -->
    <view class="item">
      <view class="title">{{ $t("user.detailIn") }}</view>
      <view class="html">
        <view v-html="cardData.verify_card_info.content"></view>
      </view>
    </view>
  </view>
  <Shenhe v-else-if="shenheStatus == 1"></Shenhe>
</template>

<script>
import Shenhe from "@/components/shenhe/shenhe";
export default {
  components: { Shenhe },
  data() {
    return {
      cardData: {},
      card_id: ""
    };
  },

  computed: {
    getForm() {
      try {
        return JSON.parse(this.cardData.card_info.form);
      } catch (error) {
        return {
          list: [],
          name: ""
        };
      }
    }
  },
  onLoad(params) {
    this.card_id = params?.id;
    this.getCardDetail();
  },
  methods: {
    async getCardDetail() {
      const res = await this.$allrequest.coupon.verifyDetail(
        {
          sale_id: this.card_id
        },
        true
      );
      this.cardData = res.data.list;
    }
  }
};
</script>

<style lang="scss" scoped>
.message {
  background: #fff;
  color: #262626;
  font-size: 28rpx;
}
.item {
  padding: 0 24rpx;
  .title {
    margin-top: 40rpx;
  }
  .data {
    > view:nth-child(1) {
      width: 8rpx;
      height: 8rpx;
      background: #8c8c8c;
      border-radius: 50%;
      margin-right: 15rpx;
    }
    margin-top: 20rpx;
    line-height: 34rpx;
    font-size: 24rpx;
    color: #8c8c8c;
  }
  .html {
    margin-top: 20rpx;
  }
}
</style>
